<script setup lang="ts">
import { ContentWrap } from '@/components/ContentWrap'
import { ElButton } from 'element-plus'
import { useI18n } from '@/hooks/web/useI18n'
import { Table } from '@/components/Table'
import { TableColumn } from '@/types/table'
import { useTable } from '@/views/Comment/ProductComment/useTable'
import { useValidator } from '@/hooks/web/useValidator'
import { ref, reactive } from 'vue'
import {cCommentData} from "@/api/comment/types";
import {getProductCommentApi, getProductManagementtApi} from "@/api/comment";

const { t } = useI18n()

const { required } = useValidator()

const columns = reactive<TableColumn[]>([
  {
    field: 'id',
    label: '序号'
  },
  {
    field: 'account',
    label: '成员账号'
  },
  {
    field: 'nickname',
    label: '昵称'
  },
  {
    field: 'course_name',
    label: '所属商品'
  },
  {
    field: 'comment_date',
    label: '发言时间'
  },
  {
    field: 'content',
    label: '发言内容'
  },
  {
    field: 'status',
    label: '状态',
    formatter: (_: Recordable, __: TableColumn, cellValue: number) => {
      if(cellValue == 3){
        return "删除"
      } else if (cellValue == 2){
        return "拦截"
      } else if (cellValue == 1){
        return "正常"
      } else if (cellValue == 0){
        return "异常"
      }
    }
  },
  {
    field: 'status',
    label: '操作'
  }
])

//获取课程评论数据
const { register, tableObject, methods } = useTable<cCommentData>({
  getListApi: getProductCommentApi,
  response: {
    list: 'list',
    total: 'total'
  },
  props: {
    columns
  }
})
const { getList, setSearchParams } = methods

getList()

const loading = ref(false)

//前端用户
const leadingUser = async () => {
  const res = await getProductCommentApi(
      {
        type: 4,
        status: 0,
        userType: 2
      }
  ).catch(() => {})
      .finally(() => {
        loading.value = false
      })
  if (res) {
    tableObject.tableList = res.data
    tableObject.total = res.data.length
  }
}

//管理人员
const management = async () => {
  const res = await getProductManagementtApi(
      {
        type: 4,
        status: 0,
        userType: 3
      }
  ).catch(() => {})
      .finally(() => {
        loading.value = false
      })
  if (res) {
    tableObject.tableList = res.data
    tableObject.total = res.data.length
  }
}

//全部评论
const allComments = async () => {
  const res = await getProductManagementtApi(
      {
        type: 4,
        status: 0,
        userType: 3
      }
  ).catch(() => {})
      .finally(() => {
        loading.value = false
      })
  if (res) {
    tableObject.tableList = res.data
    tableObject.total = res.data.length
  }
}

//正常
const norma = async () => {
  const res = await getProductManagementtApi(
      {
        type: 4,
        status: 1,
        userType: 3
      }
  ).catch(() => {})
      .finally(() => {
        loading.value = false
      })
  if (res) {
    tableObject.tableList = res.data
    tableObject.total = res.data.length
  }
}

//已拦截
const blocked = async () => {
  const res = await getProductManagementtApi(
      {
        type: 4,
        status: 2,
        userType: 3
      }
  ).catch(() => {})
      .finally(() => {
        loading.value = false
      })
  if (res) {
    tableObject.tableList = res.data
    tableObject.total = res.data.length
  }
}

//已删除
const deleted = async () => {
  const res = await getProductManagementtApi(
      {
        type: 4,
        status: 3,
        userType: 3

      }
  ).catch(() => {})
      .finally(() => {
        loading.value = false
      })
  if (res) {
    tableObject.tableList = res.data
    tableObject.total = res.data.length
  }
}
</script>

<template>
  <ContentWrap :title="t('comment.userType')">
    <ElButton type="primary" @click="leadingUser">
      {{ t('comment.leadingUser') }}
    </ElButton>
    <ElButton type="primary" @click="management">
      {{ t('comment.management') }}
    </ElButton>
  </ContentWrap>
  <ContentWrap :title="t('comment.commentType')">
    <ElButton type="primary" @click="allComments">
      {{ t('comment.allComments') }}
    </ElButton>
    <ElButton type="success" @click="norma">
      {{ t('comment.normal') }}
    </ElButton>
    <ElButton type="warning" @click="blocked">
      {{ t('comment.blocked') }}
    </ElButton>
    <ElButton type="danger" @click="deleted">
      {{ t('comment.deleted') }}
    </ElButton>
  </ContentWrap>
  <ContentWrap :title="t('comment.datalist')">
    <Table
      :border="true"
      v-model:pageSize="tableObject.pageSize"
      v-model:currentPage="tableObject.currentPage"
      :data="tableObject.tableList.slice((tableObject.currentPage - 1) * tableObject.pageSize,tableObject.currentPage * tableObject.pageSize)"
      :loading="tableObject.loading"
      :pagination="{ total: tableObject.total }"
      @register="register"
    >
    </Table>
  </ContentWrap>
</template>
